<template>
  <Layout>
    <div class="couner">
      <div class="boxl">
        <meiTanChanLiang></meiTanChanLiang>
        <jueJinJinChi></jueJinJinChi>
        <meiTanCangChu></meiTanCangChu>
      </div>
      <div class="boxc">
        <maps></maps>
        <shuJuShangChuan></shuJuShangChuan>
      </div>
      <div class="boxr">
        <jingXiaRenYuan></jingXiaRenYuan>
        <sheBeiJianKong></sheBeiJianKong>
      </div>
    </div>
  </Layout>
</template>
<script setup>
import Layout from "@/layout/index.vue"
// 煤炭产量
import meiTanChanLiang from "./components/meiTanChanLiang.vue";
import jueJinJinChi from "./components/jueJinJinChi.vue";
import meiTanCangChu from "./components/meiTanCangChu.vue";
import jingXiaRenYuan from "./components/jingXiaRenYuan.vue";
import sheBeiJianKong from "./components/sheBeiJianKong.vue";
import maps from "./components/maps.vue";
import shuJuShangChuan from "./components/shuJuShangChuan.vue";
</script>
<style scoped>
.couner{
  width: 100%;
  height: 100%;
  display: flex;
  gap:10px;
}
.boxl,.boxr{
  width: 500px;
  display: flex;
  flex-direction: column;
  gap:10px;
  margin-bottom: 10px;

}
.boxc{
  flex:1;
  display: flex;
  flex-direction: column;
  gap:10px;
  margin-bottom: 10px;
}

/* .boxl{
  position: absolute;
  left:10px;
  top: 0;
  z-index: 1000;
} */

/* .boxr{
  position: absolute;
  right:10px;
  top: 0;
  z-index: 1000;
} */
</style>